﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <link href="../script/css/bootstrap.css" rel="stylesheet" />
    <script src="../script/js/jquery-1.12.3.js"></script>
    <script src="../script/js/bootstrap.js"></script>
    <script src="../script/js/cus-dirs.js"></script>
</head>
<body>
    <div class="container-fluid" style="border-bottom:1px solid;">
        <div class="row" style="min-height:5em;border-bottom:1px solid;position:relative;">
            <a href="#" class="btn btn-default" style="right:0px;bottom:0px;position:absolute;" onclick="signOut();"><span class="glyphicon glyphicon-off"></span></a>
        </div>
        <div class="row">
            <div class="col-lg-2">
            </div>
            <div class="col-lg-10" style="border-left:1px solid;">
                <div style="overflow:auto;">
                    <iframe id="detail" style="height:540px;border:0px;"></iframe>
                </div>
            </div>
        </div>
    </div>
    <script>
        $(function () {
            //console.log($('#detail').parent().parent().width() + 'px');
            var rw = $('#detail').parent().parent().width();
            $('#detail').parent().css('width', (rw - 5) + 'px');
            $('#detail').css('min-width', (rw - 10) + 'px');
            //$('#detail').load(function () {
            //    console.log($('#detail').find('tr:eq(0)>th').length);
            //});

            $.get('/api/index/PCMenu', null, function (data) {
                var menu = data.data;
                var root = menu[0];
                var div = rec(root, menu);
                $('div.col-lg-2').append(div);
            }).error(function () {
                window.location.href = "login.html";
            });
        });

        function rec(pobj, jdata) {
            var div = $('<div class="list-group" style="margin-top:1em;"></div>');
            for (var i = 0; i < jdata.length; i++) {
                var p = jdata[i];
                if (p.pid == pobj.id) {
                    var event = p.url == null ? 'onclick="tagglediv(this);"' : 'onclick="openurl(this, \'' + p.url.replace('~', '') + '?btns=' + p.btns + '\');"';
                    var icon = p.icon == null ? '<span class="glyphicon glyphicon-folder-close" aria-hidden="true"></span> '
                        : '<img src="' + p.icon.replace('~', '..') + '" style="width:1em;height:1em;"/> ';
                    var aa = $('<a href="#" class="list-group-item"><div ' + event + '>' + icon + p.name + '</div></a>');
                    var div1 = rec(p, jdata);
                    aa.append(div1);
                    div.append(aa);
                    $(div1).hide();
                }
            }
            return div.html() == "" ? "" : div;
        }

        function openurl(obj, url) {
            $(obj).parent().parent().find('li').removeClass('active');
            $(obj).parent().addClass('active');
            $('#detail').attr('src', url);
            $('a').removeClass('active');
            $(obj).parent().addClass('active');
            //$('#detail').attr('width', '120%');
        }

        function tagglediv(obj) {
            $(obj).next().toggle();
            $('a').removeClass('active');
            $(obj).parent().addClass('active');
        }

        function signOut() {
            $.get('/api/login/loginOut', null, function (data) {
                window.location.href = 'login.html';
            });
        }
    </script>
</body>
</html>
